Style
Overview
The Visual's styles. Used to access the styles object and its theme configurations for styling the custom visual.
- From version: 2020.20
Properties
backgroundColor
backgroundColor: string
Background Color that was defined for the visual in the chosen theme.
const background = cvApi2.canvas.style.backgroundColor;
fontColor
fontColor: string
Font color that was defined for the visual in the chosen theme.
const fontColor = cvApi2.canvas.style.fontColor;
fontFamily
fontFamily: string
Font family that was defined for the visual in the chosen theme.
const fontFamily = cvApi2.canvas.style.fontFamily;
fontSize
fontSize: string
Font size that was defined for the visual in the chosen theme.
const fontSize = cvApi2.canvas.style.fontSize;
fontStyle
fontStyle: string
Font style that was defined for the visual in the chosen theme.
const fontStyle = cvApi2.canvas.style.fontStyle;
fontWeight
fontWeight: string
Font weight that was defined for the visual in the chosen theme.
const fontWeight = cvApi2.canvas.style.fontWeight;
lineColor
lineColor: string
Line color that was defined for the visual in the chosen theme.
const lineColor = cvApi2.canvas.style.lineColor;
pyramidThemeStyle
pyramidThemeStyle: IStyleData
The internal theme style object. Contains all theme styling properties as defined in Pyramid's theme editor. Use this to access all the (deep) styling properties that are not accessible from the API's simpler (and direct) style objects and properties.
const styles = cvApi2.canvas.style.pyramidThemeStyle;
const backgroundColor = styles.visuals.visualsGeneral.background;
themeBackgroundColor
themeBackgroundColor: string
Theme background Color that was defined for the visual in the chosen theme.
const themeBackground = cvApi2.canvas.style.themeBackgroundColor;
Methods
getRangeColors
getRangeColors ( colorRangeType : ColorRangeType ): string[]
A function for getting range of colors that have a representation in the theme. Can be used for coloring bands or indicate between chronological phases. It is useful when styling the visual with the user's chosen theme.
const colors = cvApi2.canvas.style.getRangeColors(cvApi2.enums.events.ColorRangeType.Dual);
Parameters
-
colorRangeType:ColorRangeType
An enum that represent the type of color range that is needed.
Returns string[]
Range of colors that have a representation in the theme.
getThemeColorByIndex
getThemeColorByIndex ( index : number): string
A function to return one of the 16 core theme colors. It is useful when styling the visual with the user's chosen theme.
const firstColorInTheme = cvApi2.canvas.style.getThemeColorByIndex(0);
Parameters
-
index:number
The location of the color in the theme colors list (0-15).
Returns string
Represent the selected color.